<!--
 * @Descripttion: 状态筛选组件
 * @version: 
 * @Author: 韩应波
 * @Date: 2021-02-26 10:47:25
 * @LastEditors: 韩应波
 * @LastEditTime: 2021-02-26 11:26:12
-->
<template>
  <el-select
    v-model="status"
    :placeholder="placeholder"
    @change="statusChange"
    clearable
  >
    <el-option
      v-for="item in statusList"
      :label="item.label"
      :value="item.value"
      :key="item.value"
    ></el-option>
  </el-select>
</template>

<script>
export default {
  name: 'Status',
  props: {
    value: '',
    placeholder: {
      type: String,
      default: '状态'
    },
    // 是否和正常的相反，部分字段是相反的
    reverse: {
      type: Boolean,
      default: false
    },
    statusList: {
      default () {
        if (this.reverse === false) {
          return [
            { label: '启用', value: 1 },
            { label: '停用', value: 0 }
          ]
        } else {
          return [
            { label: '启用', value: 0 },
            { label: '停用', value: 1 }
          ]
        }
      }
    }
  },
  data () {
    return {
      status: ''
    }
  },
  watch: {
    value (n) {
      this.status = n
    }
  },
  methods: {
    statusChange (e) {
      this.$emit('input', e)
      this.$emit(
        'change',
        e,
        this.statusList.filter(item => item.value == e)[0]
      )
    }
  }
}
</script>
